import React, {useState} from 'react'

//使用状态驱动页面的变化  useState 就是一个 hook 函数, 是属于 React 对象的
export default function StateCom() {
  //声明一个状态
  let [count, setCount] = useState(100);//实参的值, 就是状态的初始值
  //关于返回值 [0, ƒ]   第一个值为当前的状态值, 第二个值为更新状态的函数
  // console.log(count);
  return (
    <div>
      <h2>{count}</h2>
      <button onClick={() => {
        //调用函数 传入新的状态值  
        setCount(count + 1);// 
        //输出
        // console.log(count); // 100
      }}>新增</button>
      <button onClick={() => {
        //调用函数 传入一个函数
        setCount(old => {
          let newV = old - 1;
          console.log(newV);
          return newV;
        })
      }}>减少</button>
      <button onClick={() => {
        setCount(count);
      }}>不变</button>
    </div>
  )
}
